﻿<%@ Page Title="Kirkwood School For Children - Staff" Language="C#" MasterPageFile="~/MasterPages/Site.Master" AutoEventWireup="true" CodeBehind="Staff.aspx.cs" Inherits="Daycare.Staff" %>

<asp:Content ID="HeadContent" ContentPlaceHolderID="HeadContent" runat="server">
    <script type="text/javascript" src="Scripts/Daycare/Staff.js"></script>
</asp:Content>
<asp:Content ID="MainContent" ContentPlaceHolderID="MainContent" runat="server">
    <style type="text/css">
        <!--

        a:hover {
            text-decoration: none;
            cursor: pointer;
        }

        .hidden {
            visibility: hidden;
        }

        .checkboxlist_nowrap label {
            display: inline;
            margin-left: 5px;
        }

        .tab {
            background-color: #1D1D1D;
            color: #DDDDDD;
            padding: 5px;
            border-top-left-radius: 5px;
            border-top-right-radius: 5px;
            margin-right: 1px;
        }

            .tab:hover {
                color: white;
            }

        .selected {
            background-color: #3D3D3D;
            color: white;
            padding-top: 10px;
            padding-right: 5px;
            padding-left: 5px;
            padding-bottom: 5px;
            font-size: larger;
        }

        ::-webkit-scrollbar {
            width: 9px;
            height: 9px;
        }

        ::-webkit-scrollbar-button:start:decrement, #doc ::-webkit-scrollbar-button:end:increment {
            display: block;
            height: 0;
            background-color: transparent;
        }

        ::-webkit-scrollbar-track-piece {
            background-color: #FAFAFA;
            -webkit-border-radius: 0;
            -webkit-border-bottom-right-radius: 8px;
            -webkit-border-bottom-left-radius: 8px;
        }

        ::-webkit-scrollbar-thumb:vertical {
            height: 50px;
            background-color: #999;
            -webkit-border-radius: 8px;
        }

        ::-webkit-scrollbar-thumb:horizontal {
            width: 50px;
            background-color: #999;
            -webkit-border-radius: 8px;
        }


        .modalBackground {
            background-color: Black;
            filter: alpha(opacity=90);
            opacity: 0.8;
        }

        .modalPopup {
            -moz-border-radius: 15px;
            border-radius: 15px;
            background-color: #FFFFFF;
            padding-left: 10px;
            padding-right: 10px;
        }

        .checkBoxListDiv {
            overflow: auto;
            background-color: whitesmoke;
        }

        .divBackground {
            -moz-border-radius: 5px;
            border-radius: 5px;
            background-color: #3D3D3D;
            padding: 10px;
        }

        .divBackground-lightgrey {
            -moz-border-radius: 5px;
            border-radius: 5px;
            background-color: #eeeeee;
            padding: 10px;
        }

        .clean-gray {
            background-color: #eeeeee;
            background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #cccccc));
            background-image: -webkit-linear-gradient(top, #eeeeee, #cccccc);
            background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
            background-image: -ms-linear-gradient(top, #eeeeee, #cccccc);
            background-image: -o-linear-gradient(top, #eeeeee, #cccccc);
            background-image: linear-gradient(top, #eeeeee, #cccccc);
            border: 1px solid #ccc;
            border-bottom: 1px solid #bbb;
            border-radius: 3px;
            color: #333;
            font: bold 11px/1 "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
            padding: 8px;
            text-align: center;
            text-shadow: 0 1px 0 #eee;
            width: 150px;
        }

            .clean-gray:hover {
                background-color: #dddddd;
                background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #dddddd), color-stop(100%, #bbbbbb));
                background-image: -webkit-linear-gradient(top, #dddddd, #bbbbbb);
                background-image: -moz-linear-gradient(top, #dddddd, #bbbbbb);
                background-image: -ms-linear-gradient(top, #dddddd, #bbbbbb);
                background-image: -o-linear-gradient(top, #dddddd, #bbbbbb);
                background-image: linear-gradient(top, #dddddd, #bbbbbb);
                border: 1px solid #bbb;
                border-bottom: 1px solid #999;
                cursor: pointer;
                text-shadow: 0 1px 0 #ddd;
            }

            .clean-gray:active {
                border: 1px solid #aaa;
                border-bottom: 1px solid #888;
                -webkit-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
                box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
            }

        .smallRow {
            height: 20px;
        }
        -->
    </style>

    <div id="staffBody">
        <div style="width: 100%; padding-bottom: 0px" id="header">
            <div style="display: inline-block; margin-left: 25px;" id="staffSearch">
                <dl style="margin-top: 0px; padding-top: 0px;">
                    <dt><span style="font-weight: bold">Staff Member Management</span></dt>
                    <dd>
                        <asp:DropDownList runat="server" ID="ddlStaffMembers" AutoPostBack="True" OnSelectedIndexChanged="ddlStaffMembers_SelectedIndexChanged" TabIndex="1" />
                        <div style="display: inline-block">
                            <asp:CheckBox ID="cbIncludeTerminatedStaff" runat="server" AutoPostBack="True" TabIndex="2" OnCheckedChanged="cbIncludeTerminatedStaff_CheckedChanged" CssClass="checkboxlist_nowrap" Text="Include Terminated Employees" />
                        </div>
                    </dd>
                </dl>
            </div>
        </div>
        <div style="width: 100%; height: 600px; margin-left: 25px;" id="body">
            <div id="tabs" style="padding-top: 5px">
                <asp:LinkButton runat="server" ID="lbStaffInfoTab" Text="Info" ValidationGroup="Tab" OnClick="staffTab_Click" CssClass="tab selected" Width="125px" Style="text-align: center" /><asp:LinkButton runat="server" ID="lbStaffDetailsTab" Text="Details" ValidationGroup="Tab" OnClick="staffTab_Click" CssClass="tab" Width="125px" Style="text-align: center" /><asp:LinkButton runat="server" ID="lbStaffAccessTab" Text="Access" ValidationGroup="Tab" OnClick="staffTab_Click" CssClass="tab" Width="125px" Style="text-align: center" />
                <hr style="width: 1100px; margin-top: 0px; border: 1px solid #3D3D3D" />
            </div>
            <asp:Panel runat="server" Style="margin-left: 25px;" ID="pnlStaffInfo">
                <div style="display: inline-block; margin-right: 25px">
                    <h4>Employee Info</h4>
                    <dl style="display: inline-block; margin-right: 30px; vertical-align: top">
                        <dt>Name
                        </dt>
                        <dd>
                            <asp:TextBox runat="server" ID="tbFirstName" TabIndex="3" /><br />
                        </dd>
                        <dt>Phone Number
                        </dt>
                        <dd>
                            <asp:TextBox runat="server" ID="tbPhoneNumber" TabIndex="6" ValidationGroup="phone" BackColor="WhiteSmoke" Width="100px" /><br />
                            <ajaxToolkit:MaskedEditExtender ID="meePhoneNumber" runat="server" TargetControlID="tbPhoneNumber" Mask="(999) 999-9999" ClearMaskOnLostFocus="False" MaskType="None" />
                        </dd>
                        <dt>Email Address
                        </dt>
                        <dd>
                            <asp:TextBox runat="server" ID="tbEmailAddress" TabIndex="7" BackColor="WhiteSmoke" /><br />
                        </dd>
                        <dt></dt>
                        <dd>
                            <asp:CheckBox runat="server" ID="cbCurrentEmployee" Text="Currently Employed" TabIndex="8" Checked="True" CssClass="checkboxlist_nowrap" />
                        </dd>
                        <dt>
                            <hr />
                            <h5>Login Info</h5>
                            User Name
                        </dt>
                        <dd>
                            <asp:TextBox runat="server" ID="tbUserName" TabIndex="9" /><br />
                        </dd>
                        <dt runat="server" id="passwordDt">
                            <asp:Label ID="lblPassword" runat="server" Text="Password" />
                        </dt>
                        <dd>
                            <asp:TextBox runat="server" ID="tbPassword" TextMode="Password" TabIndex="10" /><br />
                        </dd>
                    </dl>
                    <dl style="display: inline-block; vertical-align: top">
                        <dt><span style="margin-right: 30px" />MI</span> <span>Last Name</span>
                        </dt>
                        <dd>
                            <asp:TextBox runat="server" ID="tbMiddleInit" TabIndex="4" Width="15px" BackColor="WhiteSmoke" MaxLength="1" Style="margin-right: 15px" />
                            <asp:TextBox runat="server" ID="tbLastName" TabIndex="5" /><br />
                        </dd>
                        <dt>Employee Photo
                        </dt>
                        <dd>
                            <asp:Image ID="iStaffPhoto" runat="server" Style="margin-left: 20px" /><br />
                        </dd>
                        <dt></dt>
                        <dd>&nbsp;
                        </dd>
                        <dt>Update Employee Photo
                        </dt>
                        <dd>
                            <asp:FileUpload runat="server" ID="fuEmployeePhoto" Enabled="true" TabIndex="11" /><br />
                        </dd>
                        <dt></dt>
                        <dd>&nbsp;
                        </dd>
                        <dd>
                            <asp:Button runat="server" ID="bAddUpdateStaff" CommandName="Add" Text="Add Staff Member" OnClick="bAddUpdateStaff_Click" TabIndex="12" Style="margin-left: 200px" CssClass="clean-gray" />
                        </dd>
                    </dl>
                </div>
                <div style="display: inline-block; width: 1px; border-left: 1px solid #3D3D3D; margin-right: 15px; height: 550px; vertical-align: top">
                </div>
                <div style="display: inline-block; vertical-align: top; margin-left: 25px">
                    <h4>Update Password</h4>
                    <dl>
                        <dt>New Password
                        </dt>
                        <dd>
                            <asp:TextBox runat="server" ID="tbNewPassword" TextMode="Password" Enabled="False" /><br />
                        </dd>
                        <dt>Confirm New Password
                        </dt>
                        <dd>
                            <asp:TextBox runat="server" ID="tbConfirmNewPassword" TextMode="Password" Enabled="False" /><br />
                        </dd>
                        <dt>
                            <dd>&nbsp;
                            </dd>
                        </dt>
                        <dt></dt>
                        <dd>
                            <asp:Button ID="bUpdatePassword" runat="server" CommandName="ChangePassword" Text="Update Password" Enabled="False" OnClick="bUpdatePassword_Click" ValidationGroup="UpdatePassword" CssClass="clean-gray" />
                        </dd>
                    </dl>
                </div>
            </asp:Panel>
            <asp:Panel runat="server" ID="pnlStaffDetails" Visible="false">
                <div style="display: inline-block; margin-right: 5px; vertical-align: top; width: 460px; margin-left: 25px" class="divBackground-lightgrey">
                    <div style="padding-top: 20px">
                        <asp:LinkButton runat="server" ID="lbEmployeeNotesTab" Text="Notes" ValidationGroup="Tab" CssClass="tab selected" /><asp:LinkButton runat="server" ID="lbAddUpdateEmployeeNotes" OnClick="DisplayAddUpdatePopup_Click" Style="margin-left: 368px" ClientIDMode="Static"><img src="img/icons/add.png" style="margin-bottom: -2px; vertical-align: bottom"  /></asp:LinkButton>
                        <hr style="width: 450px; margin-top: 2px; border: 1px solid #3D3D3D" />
                    </div>
                    <div style="overflow: auto; width: 460px; height: 625px">
                        <div>
                            <asp:Repeater runat="server" ID="rptEmployeeNotes">
                                <HeaderTemplate>
                                    <table style="width: 100%; text-align: center">
                                        <tr style="background-color: #333333; font-weight: bold; color: white">
                                            <th style="margin-right: 150px; width: 300px">Note</th>
                                            <th style="width: 150px">Noted By</th>
                                        </tr>
                                </HeaderTemplate>
                                <ItemTemplate>
                                    <tr style="background-color: white; border-bottom: 1px solid black">
                                        <td>
                                            <asp:Label runat="server" Text='<%# Eval("NoteText") %>' />
                                        </td>
                                        <td>
                                            <asp:Label runat="server" Text='<%# Eval("noteOwner.FullName") %>' /><br />
                                            <asp:Label runat="server" Text='<%# Eval("timestamp") %>' />
                                        </td>
                                    </tr>
                                </ItemTemplate>
                                <FooterTemplate>
                                    </table>
                                </FooterTemplate>
                            </asp:Repeater>
                        </div>
                    </div>
                </div>
                <div style="display: inline-block; margin-right: 10px; vertical-align: top;" class="divBackground-lightgrey">
                    <div style="padding-top: 20px">
                        <asp:LinkButton runat="server" ID="lbEmployeeDocumentsTab" Text="Documents" ValidationGroup="Tab" CssClass="tab selected" /><asp:LinkButton runat="server" ID="lbAddUpdateEmployeeDocuments" OnClick="DisplayAddUpdatePopup_Click" Style="margin-left: 437px" ClientIDMode="Static"><img src="img/icons/add.png" style="margin-bottom: -2px; vertical-align: bottom"  /></asp:LinkButton>
                        <hr style="width: 560px; margin-top: 2px; border: 1px solid #3D3D3D" />
                    </div>
                    <div style="overflow: auto; width: 575px; height: 625px">
                        <asp:Repeater runat="server" ID="rptEmployeeDocuments">
                            <HeaderTemplate>
                                <table style="width: 100%; text-align: center">
                                    <tr style="background-color: #333333; font-weight: bold; color: white">
                                        <th style="margin-right: 150px; width: 300px">Note</th>
                                        <th style="width: 150px">Noted By</th>
                                    </tr>
                            </HeaderTemplate>
                            <ItemTemplate>
                                <tr style="background-color: white; border-bottom: 1px solid black">
                                    <td>
                                        <asp:Label runat="server" Text='<%# Eval("NoteText") %>' />
                                    </td>
                                    <td>
                                        <asp:Label runat="server" Text='<%# Eval("noteOwner.FullName") %>' /><br />
                                        <asp:Label runat="server" Text='<%# Eval("timestamp") %>' />
                                    </td>
                                </tr>
                            </ItemTemplate>
                            <FooterTemplate>
                                </table>
                            </FooterTemplate>
                        </asp:Repeater>
                    </div>
                </div>
            </asp:Panel>
            <asp:Panel runat="server" Style="margin-left: 25px;" ID="pnlStaffAccess" Visible="false">
                <div style="display: inline-block">
                    <h4>Roles</h4>
                    <asp:GridView runat="server" ID="gvRoles" ShowHeaderWhenEmpty="True" Height="500px" Width="1000px" AutoGenerateColumns="False" BackColor="White" BorderColor="#CCCCCC" BorderStyle="None" BorderWidth="1px" CellPadding="4" ForeColor="Black" GridLines="Horizontal" CellSpacing="2">
                        <Columns>
                            <asp:BoundField DataField="RoleName" SortExpression="RoleName" ReadOnly="true" HeaderText="Role Name" HeaderStyle-Width="100px">
                                <HeaderStyle Width="150px" />
                            </asp:BoundField>
                            <asp:BoundField DataField="Description" SortExpression="Description" ReadOnly="true" HeaderText="Description" HeaderStyle-Width="400px">
                                <HeaderStyle Width="550px" />
                            </asp:BoundField>
                            <asp:TemplateField HeaderText="Has Access" HeaderStyle-Width="200px">
                                <ItemStyle HorizontalAlign="Center" />
                                <ItemTemplate>
                                    <asp:CheckBox runat="server" ID="cbHasAccess" Enabled="false" />
                                </ItemTemplate>
                                <HeaderStyle Width="100px" />
                            </asp:TemplateField>
                        </Columns>
                        <FooterStyle BackColor="#CCCC99" ForeColor="Black" />
                        <HeaderStyle BackColor="#333333" Font-Bold="True" ForeColor="White" />
                        <PagerStyle BackColor="White" ForeColor="Black" HorizontalAlign="Right" />
                        <SelectedRowStyle BackColor="#CC3333" Font-Bold="True" ForeColor="White" />
                        <SortedAscendingCellStyle BackColor="#F7F7F7" />
                        <SortedAscendingHeaderStyle BackColor="#4B4B4B" />
                        <SortedDescendingCellStyle BackColor="#E5E5E5" />
                        <SortedDescendingHeaderStyle BackColor="#242121" />
                    </asp:GridView>
                    <br />
                    <div style="margin-left: 900px">
                        <asp:Button runat="server" ID="bUpdatePermissions" Text="Update Roles" Enabled="False" OnClick="bUpdatePermissions_Click" CssClass="clean-gray" />
                    </div>
                </div>
            </asp:Panel>
        </div>
    </div>

    <asp:Button runat="server" ID="bHiddenPopupStaffDocuments" Style="display: none" Enabled="true" />
    <ajaxToolkit:ModalPopupExtender ID="mpeStaffDocuments" runat="server" TargetControlID="bHiddenPopupStaffDocuments" PopupControlID="pnlStaffDocumentsPopup" BackgroundCssClass="modalBackground" />
    <asp:Panel ID="pnlStaffDocumentsPopup" runat="server" CssClass="modalPopup" Style="display: none; background-color: #eeeeee" Width="300px">
        <div style="padding: 10px;">
            <h4>
                <asp:Label runat="server" ID="lblAddUpdateStaffDocument" Text="Add a Document" /></h4>
            <asp:Panel runat="server" ID="pnlAddUpdateStaffDocument">
                <dl style="display: inline-block; vertical-align: top; width: 250px">
                    <dt>Name
                    </dt>
                    <dd>
                        <asp:TextBox runat="server" ID="tbDocumentName" TabIndex="10" ValidationGroup="Document" /><br />
                        <asp:RequiredFieldValidator runat="server" ID="rfvDocumentName" ControlToValidate="tbDocumentName" ErrorMessage="Document name required." ValidationGroup="Document" />
                    </dd>
                    <dt>Document Type
                    </dt>
                    <dd>
                        <asp:DropDownList ID="ddlDocumentTypes" runat="server" TabIndex="11" Width="150px" />
                        <asp:LinkButton runat="server" ID="lbDocumentTypeConfig" PostBackUrl="DaycareAdmin.aspx" ToolTip="Go to Daycare Admin to configure document types." ValidationGroup="Document"><img src="img/icons/gear.png" /></asp:LinkButton><br />
                        <asp:RequiredFieldValidator runat="server" ID="rfvDocumentType" ControlToValidate="ddlDocumentTypes" InitialValue="Select One" ErrorMessage="You must choose a document type." />
                    </dd>
                    <dt>Expiration Date <span style="font-size: xx-small">(Optional)</span>
                    </dt>
                    <dd>
                        <asp:TextBox runat="server" ID="tbDocumentExpirationDate" TabIndex="12" Width="75px" /><br />
                        <ajaxToolkit:CalendarExtender runat="server" TargetControlID="tbDocumentExpirationDate" Format="MM/dd/yyyy" />
                    </dd>
                    <dt></dt>
                    <dd>&nbsp;
                    </dd>
                    <dt>Upload Document
                    </dt>
                    <dd>
                        <asp:FileUpload runat="server" ID="fuDocument" AllowMultiple="false" Enabled="true" TabIndex="13" /><br />
                        <asp:LinkButton runat="server" ID="lbDocumentLink" /><br />
                    </dd>
                </dl>
            </asp:Panel>
            <div style="float: right">
                <asp:Button ID="btnStaffDocumentsPopupCancel" runat="server" Text="Cancel" Style="margin-bottom: 10px; margin-right: 15px" CssClass="clean-gray" OnClick="btnEmployeeDocumentsPopup_Click" />
                <asp:Button ID="btnStaffDocumentsPopupOk" runat="server" Text="OK" Style="margin-bottom: 10px" CssClass="clean-gray" OnClick="btnEmployeeDocumentsPopup_Click" ValidationGroup="Document" />
            </div>
        </div>
    </asp:Panel>

    <asp:Button runat="server" ID="bHiddenPopupStaffNotes" Style="display: none" Enabled="true" />
    <ajaxToolkit:ModalPopupExtender ID="mpeStaffNotes" runat="server" TargetControlID="bHiddenPopupStaffNotes" PopupControlID="pnlStaffNotesPopup" BackgroundCssClass="modalBackground" />
    <asp:Panel ID="pnlStaffNotesPopup" runat="server" CssClass="modalPopup" Style="display: none; background-color: #eeeeee" HorizontalAlign="Center">
        <div style="padding: 10px;">
            <h4>
                <asp:Label runat="server" ID="lblAddUpdateStaffNote" Text="Add a Note" /></h4>
            <asp:Panel runat="server" ID="pnlAddUpdateStaffNote">
                <dl>
                    <dt>
                        <asp:Label runat="server" Style="font-weight: bold" Text="Note" />
                    </dt>
                    <dd>
                        <asp:TextBox runat="server" ID="tbStaffNote" Height="150px" TextMode="MultiLine" Width="300px" ValidationGroup="NoteCreate" /><br />
                        <asp:RequiredFieldValidator runat="server" ID="rfvStaffNote" ControlToValidate="tbStaffNote" ErrorMessage="Note text required." ValidationGroup="NoteCreate" />
                    </dd>
                </dl>
            </asp:Panel>
            <asp:Button ID="btnStaffNotesPopupCancel" runat="server" Text="Cancel" Style="margin-bottom: 10px; margin-right: 15px" CssClass="clean-gray" OnClick="btnEmployeeNotesPopupButton_Click" ClientIDMode="Static" />
            <asp:Button ID="btnStaffNotesPopupOk" runat="server" Text="OK" Style="margin-bottom: 10px" CssClass="clean-gray" ValidationGroup="NoteCreate" OnClick="btnEmployeeNotesPopupButton_Click" ClientIDMode="Static" />
        </div>
    </asp:Panel>
</asp:Content>
